<template>
  <div>
    <form @submit.prevent="add()">
      <div class="mb-3 row">
        <label for="inputPassword" class="col-sm-2 col-form-label"
          >阶段名称</label
        >
        <div class="col-sm-10">
          <input
            type="text"
            class="form-control"
            v-model="stname"
            required="required"
          />
        </div>
      </div>
      <div class="mb-3 row">
        <label for="inputPassword" class="col-sm-2 col-form-label"
          >所属学科</label
        >
        <div class="col-sm-10">
          <el-select v-model="subject.id" placeholder="请选择">
            <el-option
              v-for="item in subjects"
              :key="item.id"
              :label="item.sname"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </div>
      </div>
      <button type="submit" class="btn btn-secondary">提交</button>
      &nbsp;&nbsp;&nbsp;
      <router-link to="/stage/list" class="btn btn-secondary">返回</router-link>
    </form>
  </div>
</template>

<script>
export default {
  name: "StageAdd",
  data() {
    return {
      stname: "",
      subject: {
        id: "",
      },
      subjects: [],
    };
  },
  methods: {
    add() {
      this.axiosJSON
        .post("/stage/add", { stname: this.stname, subject: this.subject })
        .then((result) => {
          if (result.data.code == 0) {
            this.$message({
              message: result.data.msg,
              type: "success",
            });
            this.$router.push("/stage/list"); //编程方式跳转到阶段列表组件
          } else {
            this.$message.error({
              message: result.data.msg,
            });
          }
        });
    },
    getSubject() {
      this.axiosJSON.post("/subject/getAllWithoutPage").then((result) => {
        this.subjects = result.data.data;
      });
    },
  },
  mounted() {
    this.$parent.stageTitle = "阶段增加";
    this.getSubject();
  },
};
</script>

<style>
</style>
